<template>
  <div class="my-container bgc11 h100vh w100vw pos-r">
    <div class="w100vw h50vw">
      <swipe />
    </div>
    <category-menu />
    <newpro-list />
    <hotpro />
    <reviewlist />
    <allprolist />
    <div class="pos-f b100 r15">
      <div>
        <AweIcon url="/cart" name="shopping-cart" class="index-icon fz25 w40 h40 br20 bgc14 flx-mm mb5"/>
        <NotifyDot :dot-num="cartNum" v-if="cartNum" />
      </div>
      <div>
        <AweIcon url="/usr" name="user-circle-o" class="index-icon fz25 w40 h40 br20 bgc14 flx-mm"/>
      </div>
    </div>
  </div>
</template>

<script>
import swipe from "../components/index/swipe"
import categoryMenu from "components/index/category-menu"
import newproList from "components/index/new-pro-list/newpro-list"
import hotpro from "../components/index/hotpro/hotpro"
import reviewlist from "../components/index/reviews/reviewlist"
import allprolist from "../components/index/allprolist/allprolist"
import {myTools} from "../assets/myTools/jsTools/jsTools"
import AweIcon from 'assets/myTools/vueTools/com/common/awe-icon/awe-icon'
import NotifyDot from 'assets/myTools/vueTools/com/common/notify-dot/notify-dot'
export default {
  components: {
    swipe,
    categoryMenu,
    newproList,
    hotpro,
    reviewlist,
    allprolist,
    AweIcon,
    NotifyDot,
  },
  data() {
    return {
      uid: 'uid_1',
      cartNum: 0,
      test: 'default'
    }
  },
  async mounted() {
    let usr = {
      uid: this.uid
    }
    myTools.saveSession('usr', usr)
    let {status, data} = await this.$axios.post('/usr/getUsrCart', {
      params: {
        uid: this.uid
      }
    })
    if(status === 200 && data.code === 0) {
      this.cartNum = data.data.length
    }
  }

}
</script>

<style lang="stylus" lang="stylus">
.index-icon
  box-shadow 0 4px 8px 0 rgba(0,0,0,.2)
</style>
